<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>封装计时器类</title>
  </head>
  <body>
    <button class="start">计时开始</button>
    <button class="end">计时结束</button>
    <br />
    输入计时时间<input type="number" class="time" />

    <script type="module">
      import { Timer } from "./index.js";
      // 示例使用
      const startBtn = document.querySelector(".start");
      const endBtn = document.querySelector(".end");
      const timeEl = document.querySelector(".time");

      const timer = new Timer();

      function foo(time) {
        console.log(`已经计时${time}秒`);
      }

      startBtn.onclick = () => {
        const time = timeEl.value * 1;
        timer.start(time, foo);
      };
      endBtn.onclick = () => {
        timer.stop();
      };
    </script>
  </body>
</html>
